<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>查询科室</title>
    <script type="text/javascript" th:src="@{/js/jquery-3.2.1.min.js}"></script>
    <style type="text/css">

        body {
            background-image: url(/Content/z4.jpg);
            background-size: cover;
        }
        table {
            margin-top: 30px;
            font-family: STKaiti;
            border-collapse: collapse;
            border: 1px dashed white;
        }

        table tbody {
            display: block;
            height: 350px;
            overflow-y: scroll;
        }


        table thead,
        tbody tr {
            display: table;
            width: 100%;
            table-layout: fixed;
        }
        table tr td:nth-child(9) {
            background-color:white;
        }
        h1 {
            font-size: 40px;
            text-align: center;
            letter-spacing: 15px;
            color: gray;
            font-family: STKaiti;
        }
        #all-requst {
            margin-top: 30px;
            font-family: STKaiti;
        }

        table tr:nth-child(even) {
            background-color: #FFFFFF;
        }
        table tr:nth-child(odd) {
            background-color: #E6E6FA;
        }
        table th:nth-child(even) {
            background-color: #DDDDDD;
        }

        table th:nth-child(odd) {
            background-color: #CCCCFF;
        }

        table, thead, tbody {
            width: 1200px;
        }

        th {
            color: white;
            height: 60px;
            text-align: center;
            font-size: 20px;
            font-weight: lighter;
            letter-spacing: 2px;
            border-radius:5px;
        }
        tr, td {
            border: 1px dotted white;
            height: 30px;
            text-align: center;
        }

        tbody {
            font-size: 1em;
            padding: 20px;
        }
        table tr:hover {
            background-color: #CCDDFF;
        }

        #accept {
            text-align: center;
            background-color: #CCDDFF;
            border: none;
            border-radius: 30px 10px;
            width: 60px;
            height: 30px;
            margin-left: 20px;
        }
    </style>
    <script type="text/javascript">
        /*$(function(){
            $.ajax({
                cache: false,
                async: false,
                url: "/getDepartment",
                type: "GET",
                dataType: "json",
                success: function(departmentList){
                    show(departmentList);
                },
                error:function(departmentList){
                    alert("科室查询失败！");
                }
            });

        function show(departmentList){
            var str = "";
            for (var i = 0; i < departmentList.length; i++) {
                str += "<tr>"
                    +"<td>" + departmentList[i].departmentName + "</td>"
                    +"<td>" + departmentList[i].departmentAddress + "</td>"
                    +"<td>" + departmentList[i].departmentTell + "</td>"
                    +"<td>" + departmentList[i].departmentDesc + "</td>"
                    +"<td>" + departmentList[i].departmentHospital + "</td>"
                    +"<td>" + "操作功能" + "</td>"
                    +"</tr>";
            }
            $("#tab").append(str);
        }
        <!-- 隔行变色 -->
        $(function () {
            $("tr:gt(0):odd").css("background-color","#fb80b5");
            $("tr:gt(0):even").css("background-color","#e0fb6e");
        });
        })*/
    </script>
</head>
<body>
<div>
    <div id="tou">
        <form th:action="@{#}">
            <h1>科室查询</h1>
        </form>
    </div>
    <div>
        <table id="all-requst">
            <thead>
            <!--<a th:href="@{/toaddDepartment}" target="together">添加科室</a>-->
            <tr>
                <th>科室名称</th>
                <th>科室地址</th>
                <th>科室电话</th>
                <th>科室简介</th>
                <!--<th>所在医院</th>-->
                <th>其他</th>
            </tr>
            </thead>

            <tbody id="tab">
            <tr th:each="department:${departmentList}">
                <td th:text="${department.departmentName}"></td>
                <td th:text="${department.departmentAddress}"></td>
                <td th:text="${department.departmentTell}"></td>
                <td th:text="${department.departmentDesc}"></td>
               <!-- <td th:text="${department.departmentHospital}"></td>-->
                <td>
                    <!--<a th:href="@{#}">修改</a>
                    <a th:href="@{#}">删除</a>-->
                    <a th:href="@{/togetDoctorByDepartmentId(departmentId=${department.departmentId})}">专家风采</a>
                </td>
            </tr>
            </tbody>
        </table>
    </div>
</div>
</body>
</html>